<template>
  <ga-spin :size="32" :loading="loading" style="width: 100%">
    <BorderBox class="m_b_16">
      <template v-slot:title_l>基本信息</template>
      <template v-slot:main_info>
        <baseInf :data="baseData" />
      </template>
    </BorderBox>
    <BorderBox class="m_b_16">
      <template v-slot:title_l>
        <div class="flex">
          <span style="margin-top: 2px">系统节点概览</span>
          <State style="margin-left: 10px" :record="normalCount" />
        </div>
      </template>
      <template v-slot:main_info>
        <ga-table
          row-key="id"
          :loading="loading"
          :pagination="false"
          :columns="columns"
          :data="nodeData"
          :bordered="false"
          :hoverable="false"
        />
      </template>
    </BorderBox>
    <BorderBox class="m_b_16">
      <template v-slot:title_l>资源使用情况</template>
      <template v-slot:main_info>
        <resourceInf :data="resourceData" />
      </template>
    </BorderBox>
  </ga-spin>
</template>

<script setup>
import {
  ref,
  defineEmits,
  defineExpose,
  defineProps,
  toRefs,
  onMounted,
  reactive,
} from "vue";
import { columns } from "@/views/containerSystem/components/nodeColumn.js";
import useLoading from "@/utils/loading";
import {
  getNodeList,
  getSystemDetail,
  getBasicResource,
} from "@/api/ebpfnode.js";
import { useRoute, useRouter } from "vue-router";
import State from "@/components/System/State.vue";
import baseInf from "@/views/containerSystem/components/baseInf.vue";
import resourceInf from "@/views/containerSystem/components/resourceInf.vue";

const route = useRoute();
const router = useRouter();

const { systemId, type } = route.query;
const { loading, setLoading } = useLoading(false);
const emits = defineEmits(["handleSubmit"]);

const nodeData = ref([
  {
    workLoadName: "",
    requestTotal: "",
    requestTotalDODRatio: "",
    requestTotalRingRatio: "",
    errorRatio: "",
    errorRatioDODRatio: "",
    errorRatioRingRatio: "",
    responseTime: "",
    responseTimeDODRatio: "",
    responseTimeRingRatio: "",
    exceptionMsg: "",
  },
]);

const baseData = ref();
const listQuery = ref({
  systemId: "",
  type: "",
  from: "2024-09-06 16:40:02",
  to: "2024-09-06 17:40:02",
});

const normalCount = ref([]);
const resourceData = ref();

onMounted(() => {
  listQuery.value.systemId = systemId;
  listQuery.value.type = type;
  fetchBaseData();
  fetchNodeData();
  fetchResourceData();
});

// 获取节点概览
const fetchNodeData = async () => {
  setLoading(true);
  try {
    const { data, code } = await getNodeList(listQuery.value);
    // console.log("data", data);
    if (code === 20000) {
      normalCount.value = data;
      const abnormalWorkLoads = data.abnormalWorkLoads;
      nodeData.value = abnormalWorkLoads.map(
        ({
          workLoadName,
          requestTotal,
          requestTotalDODRatio,
          requestTotalRingRatio,
          errorRatio,
          errorRatioDODRatio,
          errorRatioRingRatio,
          responseTime,
          responseTimeDODRatio,
          responseTimeRingRatio,
          exceptionMsg,
        }) => ({
          workLoadName,
          requestTotal,
          requestTotalDODRatio,
          requestTotalRingRatio,
          errorRatio,
          errorRatioDODRatio,
          errorRatioRingRatio,
          responseTime,
          responseTimeDODRatio,
          responseTimeRingRatio,
          exceptionMsg,
        })
      );
    }
  } catch (err) {
  } finally {
    setLoading(false);
  }
};

//获取基本信息
const fetchBaseData = async () => {
  setLoading(true);
  try {
    const { data } = await getSystemDetail(listQuery.value);
    baseData.value = data;
  } catch (err) {
  } finally {
    setLoading(false);
  }
};

//获取资源使用情况
const fetchResourceData = async () => {
  setLoading(true);
  try {
    const { data } = await getBasicResource(listQuery.value);
    // console.log("resourceData", data);
    resourceData.value = data;
  } catch (err) {
  } finally {
    setLoading(false);
  }
};

defineExpose({});
</script>
<style lang="scss" scoped></style>
